<!-- 学习中心帖子详情页面 -->
<template>
	<view id="body">
		<!-- 动态详情头部 -->
		<view class="info-top">
			<!-- 用户头像 -->
			<view class="userImg">
				<image :src="post.issueUserImg" class="user-logo"></image>
			</view>
			<!-- 用户名称 -->
			<view class="user-name">
				<text>{{post.issueUserName}}</text>
			</view>
			<!-- 帖子分类 -->
			<view class="posting-type">
				<text class="type-text">{{type[post.type-1]}}</text>
			</view>
			<!-- 帖子时间 -->
			<view class="createTime">
				<text>{{post.createTime}}</text>
			</view>
			<!-- 删除图标 -->
			<view class="deleteicon" @click="deletepost">
				<text class="t-icon t-icon-gengduo1" style="width: 48rpx; height: 48rpx;"></text>
			</view>
			<!-- 帖子内容 -->
			<view class="content">
				<text>{{post.content}}</text>
			</view>
			<!-- 图片列表 -->
			<view class="imgList" v-for="(item1,index) in post.postImglist">
				<view class="imgview">
					<image v-if="index == 0 & post.postImglist.length == 1 " :src="item1" class="imgList-img"></image>
					<image v-if="index == 0 & post.postImglist.length > 1 " :src="item1" class="imgleftCss"></image> 
					<image :key="index" :src="item1" v-if="index != post.postImglist.length - 1 & index != 0" class="imgList-img"></image>
					<image v-if="post.postImglist.length > 1 & index == post.postImglist.length - 1 " :src="item1" class="imgrightCss"></image>
				</view>
			</view>
		</view>
		<!-- 评论回复 -->
		<view class="commentview">
			<view style="padding-top: 20rpx;">
				<u-divider text="评论内容"></u-divider>
			</view>
			<!-- 评论数 -->
			<view class="comment">
				<text class="comment-text">评论</text>
				<text class="comment-text-num">{{post.commentnum}}</text>
			</view>
			<!-- 点赞数 -->
			<view class="praise">
				<text class="praise-text">赞</text>
				<text class="praise-num">{{post.praisenum}}</text>
			</view>
			<!-- 水平线 -->
			<view class="line" v-if="fistcommentListInfo.length > 0"> 
				<u-line color="#d5d7da"></u-line>
			</view>
			<!-- 详细评论回复信息 -->
			<view class="comment-content" v-if="fistcommentListInfo.length > 0 ">
				<!-- 评论 -->
				<view class="comment-fistcommentList" v-for="(item,index) in fistcommentListInfo" :key="index" >
					<!-- 具体评论类容 -->
					<view class="fistcomment">
						<!-- 评论用户头像 -->
						<view class="fistcomment-userimg">
							<image :src="item.commentUserimg" class="user-logo1"></image>
						</view>
						<!-- 评论用户名称 -->
						<view class="fistcomment-username">
							<text class="fistcomment-usernametext">{{item.commentUsername}}</text>
						</view>
						<!-- 评论时间 -->
						<view class="fistcomment-time">
							<text>{{item.createTime}}</text>
						</view>
						<!-- 评论类容 -->
						<view class="fistcomment-content" >
							<view class="content-text" @click="commentclick(index)" @longpress="plopen(index)">
								<text>{{item.content}}</text>		
							</view>
						</view>
					</view>
					<!-- 该评论回复信息 -->
					<view class="answer" v-if="item.answerIdlist.length > 0 ">
						<view class="answerList" v-if="item1.belongtofistcomment == item.id" v-for="(item1,index1) in answerListInfo" :key="index1" @click.stop="answerclick(index1)" @longpress="hfopen(index1)">
							<!-- 回复用户名称 -->
							<view class="answer-username">
								<text>{{item1.answerUsername}}</text>
							</view>
							<text class="center-text">回复</text>
							<!-- 回复的用户名称 -->
							<view class="answer-tousername">{{item1.answerTousername}}</view>
							<text>:  </text> 
							<!-- 回复的类容 -->
							<view class="answer-content">
								<text>{{item1.answerContent}}</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 评论模态框 -->
		<view>
			<u-popup :show="show" :round="10" mode="bottom" @close="close" @open="open" >
				<view class="ct">
					<view class="ctview">
						<input :placeholder="commenttext" v-model="cttext" />
					</view>
					<view class="plbutton" @click="hubutton">
						<text style="line-height: 68rpx;">立即回复</text>
					</view>
				</view>
			</u-popup>
		</view>
		<view>
			<u-modal :show="tzshow" :closeOnClickOverlay="true" @confirm="tzdelete" @close="tzplclose">
				<text>确定删除该帖子?</text>
			</u-modal>
		</view>
		<view>
			<u-modal :show="plshow" :closeOnClickOverlay="true" @confirm="pldelete" @close="plclose">
				<text>确定删除该评论?</text>
			</u-modal>
		</view>
		<view>
			<u-modal :show="hfshow" :closeOnClickOverlay="true" @confirm="hfdelete" @close="hfclose">
				<text>确定删除该回复?</text>
			</u-modal>
		</view>
		<!-- 加载动画 -->
		<view class="loading" >
			<u-loadmore :status="status" :line="line" :nomoreText="nomoreText" /> 
		</view>
	</view>
</template>

<script>
	import {http} from "../static/service/requestAddress/rtas.js"
	export default {
		data() {
			return {
				post:{
				},
				olddata : {},
				//标签类型
				type:["分享","求助","帮忙"],
				status:"loading",
				nomoreText:"没有更多了",
				fistcommentListInfo:[],//评论数据
				answerListInfo:[],//回复数据
				show:false,
				commentclickId:"",//点击回复的评论id
				commentclickIndex:"",//点击回复评论的index，
				answerclickId:"",//点击回复的回复id
				answerclickIndex:"",//点击回复的回复index,
				cttext:"",//回复内容
				commenttext:"",//回复给那个用户的文本
				T:false,//点击的是否是评论的回复
				plshow:false,//删除评论模态框
				hfshow:false,//删除回复模态框
				tzshow:false,//删除帖子模态框
				plindex:0,//要删除的评论index
				hfindex:0,//要删除的回复index
			}
		},
		methods:{
			onLoad(options){
				console.log(options.data)
				var T = false
				this.nomoreText = "正在加载中..."
				//处理数据
				var datalist = JSON.parse(options.data)
				this.olddata = datalist
				//对图片处理
				datalist.postImglist = datalist.postImglist.split(",")
				datalist.postImglist = datalist.postImglist.filter(b=>b && b.trim())
				//对评论个数处理
				if(datalist.commentidlist != "" | datalist.commentidlist.length > 0){
					var T = datalist.commentidlist.split(",")
					T = T.filter(b=>b && b.trim())
					datalist.commentidnum = T.length
				}else{
					datalist.commentidnum = 0
				}
				//获取帖子的评论信息
				if(datalist.commentidlist == "" | datalist.commentidlist.length == 0){
					this.post = datalist
					console.log("数据："+JSON.stringify(this.post))
					this.status = "nomore"
					this.nomoreText="——没有更多了——"
					return
				}
				uni.request({
					url:http+"studyfistcomment/"+datalist.id,
					method:"GET",
					complete:(res)=>{ 
						if(res.data.code == 20021){
							this.fistcommentListInfo = res.data.date
							//获取每条评论的回复消息
							 for(var j = 0; j< this.fistcommentListInfo.length;j++){
								this.fistcommentListInfo[j].createTime = this.fistcommentListInfo[j].createTime.substring(0,this.fistcommentListInfo[j].createTime.lastIndexOf(" "))
								if(this.fistcommentListInfo[j].answerIdlist != "" & this.fistcommentListInfo[j].answerIdlist.length > 0){
									uni.request({
										url:http+"studyanswer/"+this.fistcommentListInfo[j].answerIdlist,
										method:"GET",
										complete:(res)=>{
											if(res.data.code == 20021){
												this.answerListInfo = this.answerListInfo.concat(res.data.date)
											}else{
												console.log("获取失败")
											}
										}
									})
								}
							}
							T = true
						}else{
							console.log("获取失败")
						}
					}
				})
				if(T){
					this.post = datalist
					this.status = "nomore"
					this.nomoreText="——没有更多了——"
				}
			},
			//回复评论点击事件
			commentclick(index){
				this.commentclickId = this.fistcommentListInfo[index].id
				this.commenttext = "回复给  :  "+this.fistcommentListInfo[index].commentUsername
				this.show = true
				this.commentclickIndex = index
				this.T = true
			},
			//回复回复点击事件
			answerclick(index){
				this.answerclickId = this.answerListInfo[index].id
				this.commenttext = "回复给  :  "+this.answerListInfo[index].answerUsername
				this.show = true
				this.answerclickIndex = index
				this.T = false
			},
			//打开模态框
			open(index){
				this.show = true
			},
			//关闭模态框
			close(){
				this.show = false
			},
			//发布回复
			hubutton(){
				//显示消息提示框
				uni.showLoading({
					title:"正在回复中",
					mask: true
				})
				var user = uni.getStorageSync('user')
				//验证用户是否登录
				if(! user){
					uni.$u.toast("您还未登录，登录才能发布回复")
					return
				}
				if(this.cttext == "" | this.cttext .length == 0){
					uni.$u.toast("回复内容不能为空")
					return
				}
				var userid = JSON.parse(user).id
				var username = JSON.parse(user).name
				var userimg = JSON.parse(user).img
				var answerdata = {
					"id":"",
					"answerContent":this.cttext,
					"answerUserid":userid,
					"answerUsername":username,
					"answerTouserid":"",
					"answerTousername":"",
					"belongtofistcomment":"",
					"state":0
				}
				if(this.T){ //回复的是评论的情况
					answerdata.answerTouserid = this.fistcommentListInfo[this.commentclickIndex].commentUserid
					if(answerdata.answerTouserid == userid){
						uni.$u.toast("不能回复自己")
						this.show = false
						this.cttext = ""
						uni.hideLoading()
						return
					}
					answerdata.answerTousername = this.fistcommentListInfo[this.commentclickIndex].commentUsername
					answerdata.belongtofistcomment = this.fistcommentListInfo[this.commentclickIndex].id
					uni.request({
						url:http+"studyanswer/"+this.post.commentnum + 1,
						method:"POST",
						data:answerdata,
						complete:(res)=>{
							if(res.data.code == 20011){
								var T = res.data.date
								T.createTime = T.createTime.substring(0,T.createTime.lastIndexOf(" "))
								this.$set(this.answerListInfo,this.answerListInfo.length,T)
								this.post.commentnum += 1
								this.fistcommentListInfo[this.commentclickIndex].answerIdlist +="o"
								uni.$u.toast("评论成功!")
							}else{
								uni.$u.toast("评论失败!")
							}
						}
					})
				}else{//回复的是回复的情况
					answerdata.answerTouserid = this.answerListInfo[this.answerclickIndex].answerUserid
					if(answerdata.answerTouserid == userid){
						uni.$u.toast("不能回复自己") 
						this.show = false 
						this.cttext = ""
						uni.hideLoading()
						return
					}
					answerdata.answerTousername = this.answerListInfo[this.answerclickIndex].answerUsername
					answerdata.belongtofistcomment = this.answerListInfo[this.answerclickIndex].belongtofistcomment
					uni.request({
						url:http+"studyanswer/"+this.post.commentnum + 1, 
						method:"POST",
						data:answerdata,
						complete:(res)=>{
							if(res.data.code == 20011){
								var T = res.data.date
								T.createTime = T.createTime.substring(0,T.createTime.lastIndexOf(" "))
								this.$set(this.answerListInfo,this.answerListInfo.length,T)
								this.post.commentnum += 1
								uni.$u.toast("评论成功!")
							}else{
								uni.$u.toast("评论失败!")
							}
						}
					})
				}
				this.show = false
				this.cttext = ""
				uni.hideLoading()
			},
			//关闭删除评论模态框
			plclose(){
				this.plshow = false
			},
			plopen(index){
				//对用户登录进行判断
				var user = uni.getStorageSync('user')
				var userid = 0
				if(! user){
					uni.$u.toast("您还未登录，登录后才能删除评论")
					return
				}else{
					userid = JSON.parse(user).id
				}
				if(this.fistcommentListInfo[index].commentUserid == userid){
					this.plshow = true
					this.plindex = index
				}else{
					uni.$u.toast("您只能删除自己的评论")
				}
			}, 
			//关闭删除回复模态框
			hfclose(){
				this.hfshow = false
			},
			hfopen(index){
				//对用户登录进行判断
				var user = uni.getStorageSync('user')
				var userid = 0
				if(! user){
					uni.$u.toast("您还未登录，登录后才能删除回复")
					return
				}else{
					userid = JSON.parse(user).id
				}
				if(this.answerListInfo[index].answerUserid == userid){
					this.hfshow = true
					this.hfindex = index
				}else{
					uni.$u.toast("您只能删除自己的回复")
				}
			},
			//删除评论
			pldelete(){
				console.log("进行了删除评论"+this.plindex)
				uni.request({
					url:http+"studyfistcomment/byid/"+this.fistcommentListInfo[this.plindex].id,
					method:"DELETE",
					complete:(res)=>{
						if(res.data.code == 20031){
							this.fistcommentListInfo.splice(this.plindex,1)
							this.plindex = 0
							this.plshow = false
							this.post.commentnum -= 1
							uni.$u.toast("删除评论成功!")
						}else{
							this.plindex = 0
							this.plshow = false
							uni.$u.toast("删除评论失败!")
						}
					}
				})
			},
			//删除回复
			hfdelete(){
				uni.request({
					url:http+"studyanswer/byid/"+this.answerListInfo[this.hfindex].id,
					method:"DELETE",
					complete:(res)=>{
						if(res.data.code == 20031){
							//删除的回复id
							var id = this.answerListInfo[this.hfindex].id
							//删除的回复id所属的评论
							var plid = this.answerListInfo[this.hfindex].belongtofistcomment
							this.answerListInfo.splice(this.hfindex,1)
							//删除评论id中所属回复的id
							for(var i = 0;i < this.fistcommentListInfo.length; i++){
								if(this.fistcommentListInfo[i].id == plid){
									//删除评论中回复的id
									var T = this.fistcommentListInfo[i].answerIdlist.split(",")
									T = T.filter(b=>b && b.trim())
									for(var j = 0; j < T .length; j++){
										if(T[j] == id ){
											T.splice(j,1)
											if(T.length > 0){
												this.fistcommentListInfo[i].answerIdlist = T.join(",")
											}else{
												this.fistcommentListInfo[i].answerIdlist = ""
											}
											break
										}
									}
									break
								}
							}
							this.post.commentnum -= 1
							this.hfshow = false
							uni.$u.toast("删除回复成功!")
						}else{
							this.hfshow = false
							uni.$u.toast("删除回复失败!")
						}
					}
				})
			},
			//打开删除帖子模态框
			deletepost(){
				var user = uni.getStorageSync('user')
				var userid = 0
				if(! user){
					uni.$u.toast("您还未登录，登录后才能删除评论")
					return
				}else{
					userid = JSON.parse(user).id
				}
				if(this.post.issueUser == userid){
					this.tzshow = true
				}else{
					uni.$u.toast("只能删除自己的帖子")
				}
			},
			//关闭删除帖子模态框
			tzplclose(){
				this.tzshow = false
			},
			//删除帖子
			tzdelete(){
				uni.request({
					url:http+"study/"+this.post.id,
					method:"DELETE",
					complete:(res)=>{
						if(res.data.code == 20031){
							uni.$u.toast("删除成功")
							this.tzshow = false
							uni.reLaunch({
								url:"/forum/index"
							})
						}else{
							uni.$u.toast("删除失败!")
						}
						
					}
				})
			},
		}
	}
</script> 

<style>
	@import url("../static/css/componentsCss/study/studyinfo.css");
</style>